﻿
<span class="toolbar">
    <span class="area full">
    <div class="filters">
        <span class="filters-title"><strong>Lọc kết quả: </strong></span>    
              
        <!-- Payments -->            
        <span class="filters-item"> 
            <input type="text" class="text" style="width:160px" id="keywords" name="keywords" autocomplete="off" placeholder="keywords" data-bind="event: { keypress: RunSomethingKey3 }" />
        </span>      
              
        <!-- Category -->            
        <span class="filters-item">
            <span class="filter-wrapper">
                <span class="filter-link">
                    <strong>Danh mục:</strong> <a class="filter-trigger"><span class="leadFilter-title" filtertype="category" href="javascript:void(0)"> All</span><span class="orderby"></span></a>
                    <input type="hidden" value="" filtertype="category" id="categorySelected"/>
                </span>
                <span class="filter-data">
                    <span class="left-search">
                        <input type="textbox" class="text leadFilter-search" />
                        <ul class="search-list leadfilter-search" filtertype="category" data-bind="foreach: CategoryList">
                            <li data-bind="attr: {id: ID + 'c'}"><a href="javascript:void(0)" data-bind="text: Name, attr: {id: ID + 'c', itemtitle: Name}"></a></li>
                        </ul>
                    </span>
                            
                    <span class="right-selected">
                        <span class="hdr">Đã chọn<a href="javascript:void(0)" class="leadFilter-cancel">Hủy</a></span>
                        <ul class="selected-list leadfilter-selected" filtertype="category"></ul>
                        <span class="row">
                        <a class="btn btn-done leadfilter-done" href="javascript:void(0)">Done</a>
                        </span>
                    </span>                            
                </span> 
            </span>
        </span>       
              
        <!-- State -->            
        <span class="filters-item">
            <span class="filter-wrapper">
                <span class="filter-link">
                    <strong>Tỉnh/thành:</strong> <a class="filter-trigger"><span class="leadFilter-title" filtertype="state" href="javascript:void(0)"> All</span><span class="orderby"></span></a>
                    <input type="hidden" value="" filtertype="state" id="stateSelected"/>
                </span>
                <span class="filter-data">
                    <span class="left-search">
                        <input type="textbox" class="text leadFilter-search" />
                        <ul class="search-list leadfilter-search" filtertype="state" data-bind="foreach: StateList">
                            <li data-bind="attr: {id: ID + 'a'}"><a href="javascript:void(0)" data-bind="text: Name, attr: {id: ID + 'a', itemtitle: Name}"></a></li>
                        </ul>
                    </span>
                            
                    <span class="right-selected">
                        <span class="hdr">Đã chọn<a href="javascript:void(0)" class="leadFilter-cancel">Hủy</a></span>
                        <ul class="selected-list leadfilter-selected" filtertype="state"></ul>
                        <span class="row">
                        <a class="btn btn-done leadfilter-done" href="javascript:void(0)">Done</a>
                        </span>
                    </span>                            
                </span> 
            </span>
        </span>                       
              
        <!-- Range -->                  
        <span class="filters-item last" id="LeadFilterDropdownRangeTime">
            <span class="filter-wrapper">
                <span class="filter-link">
                    <a href="javascript:void(0)" class="filter-trigger"><strong>Ngẫu nhiên:</strong> <span class="leadFilter-range-title">All Time</span><span class="orderby"></span></a>
                    <input type="hidden" value="" filtertype="range" timepicker="false" id="RangeSelectedValue"/>
                </span>
                <span class="filter-data">                            
                    <span class="right-selected" style="width: 450px">
                        <span class="hdr">Chọn khung thời gian<a href="javascript:void(0)" class="leadFilter-cancel">Hủy</a></span>
                        <div data-bind="foreach: RangeList">
                            <a href="javascript:void(0)" class="rangeSelectItem" data-bind="text: Name, attr: {id: ID}"></a>
                        </div>
                        <div class="clear"></div>
                        <span style="padding-left: 5px">
                            <span style="padding-right: 27px; font-weight:bold">Đặc tả ngày</span>
                            <label for="txt-from" class="spl" style="font-weight:normal;">Từ:</label>
                            <input type="text" id="startDate" value=""   class="text date calendar-date spl" />

                            <label for="txt-from" class="spl" style="font-weight:normal;padding-left:35px;">Đến:</label>
                            <input type="text" id="endDate" value=""  class="text date calendar-date" />
                            <a href="javascript:void(0)" class="btn btn-done leadfilter-range-done">Done</a>
                        </span>
                    </span>                            
                </span>
            </span>
        </span>
                      
        <a class="btn btn-go" href="javascript:void(0)" data-bind="click: GoFilter">Go</a>
    </div>  
    </span>
</span>
